<nav class="navbar navbar-expand-md navbar-dark bg-primary mb-4">
  <a href="/" class="navbar-brand">ZHAW ASE</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#auctionNavbar">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="navbar-collapse collapse justify-content-stretch" id="auctionNavbar">
    <ul class="navbar-nav">
      <li class="nav-item" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}">
        <a class="nav-link" routerLink="home"><i class="fa fa-fw fa-home"></i> Home </a>
      </li>
      <li class="nav-item -5" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}">
        <a class="nav-link" routerLink="auctions"><i class="fa fa-gavel"></i> Auctions</a>
      </li>
    </ul>
    <ul class="navbar-nav ml-auto">
      <li class="nav-item">
        <a class="nav-link" href="#"><i class="fa fa-fw fa-user-plus"></i> Sign-up</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#"> <i class="fa fa-fw fa-sign-in"></i> Login</a>
      </li>
    </ul>
  </div>
</nav>
